为了账号安全,请及时绑定邮箱和手机立即绑定

JQUERY背景图全屏按比例缩放插件

标签:
JQuery

 jquery-backstretch 是一个用来实现全屏按比例缩放背景图片的jQuery插件,兼容大部分浏览器,但IE6和IE7的支持不理想。

项目主页:http://www.open-open.com/lib/view/home/1344826882069 用法很简单只需要几行简单代码就可以实现背景多种变化  

<script>   $(function () {                       //用法一      $.backstretch("img/bg.jpg");                            //用法二           $("#content").backstretch([       "img/bootstrap-mdo-sfmoma-01.jpg"     , "img/bootstrap-mdo-sfmoma-02.jpg"     , "img/bootstrap-mdo-sfmoma-03.jpg"   ], {duration: 3000, fade: 750});                                              //用法三   $("#outside").click(function(e) {     e.preventDefault();     $("#click-demo").backstretch('img/5560563_103531007912_2.jpg');   });                          $("#cheers").click(function(e) {     e.preventDefault();     $("#click-demo").backstretch('img/20071029131759934_2.jpg');   });                         }) </script>

   


  这是我做的一个小例子,不过截图很有趣,这是我通过浏览器截取的图片, 最底层那张背景图蓝天白云那个图片,所显示的区域是我浏览器能看到的区域,看不到的区域他就不绘制了. 有兴趣的可以看下例子 下载地址

点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消